﻿@using EcoTourEduca.BingYourMaps;
@using EcoTourEduca.BingYourMaps.Models;
@{
    Style.Include("map");
    Script.Require("jQuery");
    Script.Include("http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0");
    Script.Include("maplist.js");
    var mapIndex = (Context.Items["EcoTourEduca.BingYourMaps.Index"] as int?) ?? 0;
    Context.Items["EcoTourEduca.BingYourMaps.Index"] = mapIndex + 1;

    // Set size with units
    var width = (Model.MapWidth != null) ? Model.MapWidth + "pt" : "100%";
    var height = Model.MapHeight + "pt";
}
@using (Script.Foot())
{
    <script type="text/javascript">
        function initMap()
        {
            var loc = newLocation(@Html.ToInvariantCultureString((float) Model.CenterLatitude), 
                                    @Html.ToInvariantCultureString((float) Model.CenterLongitude));
            var map = newMap("BingLocation@(mapIndex)",
                        loc,
                        @Model.MapZoom,
                        "@(Ajax.JavaScriptStringEncode(Model.MapType))");

		    @{ var c = 1; }
            var pins = [
		        @foreach (BingMapsLocationPart location in Model.BingMapsLocations)
                {
                    <text>
                    {
                        Id: @(location.ContentItem.Id),
                        Lat: @Html.ToInvariantCultureString((float) location.Latitude),
                        Lng: @Html.ToInvariantCultureString((float) location.Longitude),
                        Title: "@Ajax.JavaScriptStringEncode(Model.Titles[c-1])",
                        Icon: "@Ajax.JavaScriptStringEncode(location.PinIcon)",
                        Url: "@Url.ItemDisplayUrl(location.ContentItem)"
                    }
                    </text>
                    if (c < Model.LocationsCount)
                    { 
                        @(",")
                    }
                    c++;
                }
		    ];

            addPins(pins, map, "@Model.MapIconFolder");
            $(".bing-place").hover(function(e)
            {
                hoverStart(e.currentTarget.id.substr(3));
            }, function(e)
            {
                hoverEnd(e.currentTarget.id.substr(3));
            });
        }
        $(window).load(initMap);
    </script>
}

<div id="BingLocation@(mapIndex)" 
    class="BingLocation" 
    style="position:relative; 
    width:@(width); 
    height:@(height);">
</div>

@Display(Model.BingMapsLocationContentItems)